<template>
  <div class=" publicBox" id="equipmentNewbuildCSS">
<el-form ref="form" :rules="rules" :model="ruleForm" label-position="left" label-width="181px" class="demo-form-inline publicEditFrom">
  
<el-row>
     <div class="pubPageTagP">
        <p>通信模块管理/新建</p>
     </div>
</el-row>

  <el-row>
  <el-form-item label="芯片型号" prop="no">
            <el-input class="pubSerIpt" v-model="ruleForm.no"  placeholder="请输入芯片型号"></el-input>
  </el-form-item>
</el-row>

<el-row>
    <el-form-item label="IMEI" prop="imei">
            <el-input class="pubSerIpt" v-model="ruleForm.imei" placeholder="请输入芯片IEMI型号"></el-input>
  </el-form-item>
</el-row>

<el-row>
  <el-form-item label="适配终端" prop="typeid">
  <el-select v-model="ruleForm.typeid" filterable  placeholder="洗衣机" class="pubSltL">
    <el-option
      v-for="item in deviceTyp"
      :key="item.id"
      :label="item.name"
      :value="item.id">
    </el-option>
  </el-select>
  </el-form-item>
</el-row>

<el-row>
  <el-form-item label="芯片供应商" prop="supplierId">
  <el-select v-model="ruleForm.supplierId" filterable  placeholder="上海加糖科技有限公司" class="pubSltL">
    <el-option
      v-for="item in selects"
      :key="item.id"
      :label="item.name"
      :value="item.id">
    </el-option>
  </el-select>
  </el-form-item>
</el-row>

<el-row class="pubSubmitBtn-row">
           <el-form-item>
                         <el-button class="pubBtnGree" type="primary" @click="submitForm('form')">提交</el-button>
                         <el-button class="pubBtnGray" @click="$canCleFn"  type="primary">取消</el-button>
       </el-form-item>
</el-row>

  </el-form>
  </div>
</template>

<script>
import * as API from "@api/equipmenter.js"
export default {
  components: {


  },
  data() {
    return {
        ruleForm:{
          typeid:null,
          no:'',
          imei:'',
          supplierId:''
        },
        rules:{
          no: [
            { required: true, message: '请输入芯片型号', trigger: 'blur' },
          ],
          imei: [
            { required: true, message: '请输入芯片IMEI号', trigger: 'blur' },
          ],
          typeid:[
            { required: true, message: '请选择适配终端', trigger: 'blur' }, 
          ],
          supplierId:[
            { required: true, message: '请选择芯片供应商', trigger: 'blur' }, 
          ]
        },
        deviceTyp:[],
        selects: [], 
    }
  },
  // 计算属性，会监听依赖属性值随之变化
  computed: {


  },
  // 监控data中的数据变化
  watch: {


 },
  methods: {
      async addSignal(){
        let res= await API.addSignal(this.ruleForm)
                if(res.IsPositive){
                    this.$message.success({message:"操作成功"})
                    this.$router.push({path:'/platform/equipment/signal'})
                  }else{
                    this.$message.error({message:res.ErrorCode})
                  }
      },
      async getSupplierApi(){    //获取供应商名称
        let res= await API.getSupplierApi()
                if(res.IsPositive){
                  this.selects = res.Data.records
                  // console.log('res',res.Data.records)
                }else{
                  
                }
      },
      submitForm() {
        this.$refs['form'].validate((valid) => {
          if (valid) {
               this.addSignal()
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      }
  },
  async created() {
    this.deviceTyp = await this.$getDeviceType(2,true)
    this.getSupplierApi()
  },
  mounted() {


  },
  beforeCreate() {}, // 生命周期 - 创建之前
  beforeMount() {}, // 生命周期 - 挂载之前
  beforeUpdate() {}, // 生命周期 - 更新之前
  updated() {}, // 生命周期 - 更新之后
  beforeDestroy() {}, // 生命周期 - 销毁之前
  destroyed() {}, // 生命周期 - 销毁完成
  activated() {}, // 如果页面有keep-alive缓存功能，这个函数会触发
}
</script>

<style lang='less'>
@import "../../styles/less/public.less";
  #equipmentNewbuildCSS{
      .head_text{
        margin-bottom: 5px;
        width: 140px;
        font-size:16px;
        margin-top:17px;
        margin-bottom: 14px;
        p{
            color: #a7a7a7;
        }
    }
    .el-radio__inner{
      width: 20px;
      height: 20px;
    }
    .pubbtnR{
      margin-right: 22px;
    }
    .item_box{
      margin-top: 67px;
    }
  }
</style>